import Vue from 'vue'
import Vuex from 'vuex'
import { COUNTADD } from './types';
import axios from 'axios'
import { userStore } from './user';


Vue.use(Vuex)  // 全局注册声明使用vuex 

// 每一个 Vuex 应用的核心就是 store（仓库）。“store”基本上就是一个容器，它包含着你的应用中大部分的状态 (state)
const store = new Vuex.Store({
  // Vuex 模块化 
  modules:{
    user1:userStore
  },
  // 一个对象就包含了全部的应用层级状态  
  state: {
    count:1000,
    word:"2114 - 你现在拖进度了吗?",
    city:"来武汉看樱花...",
    msg:'Are you Sleep?',
    message:'wuhan2114-daydayup',
    data:{
      flag:true,
      test:"test - test - test"
    },
    num:2114,
    list:[]
  },
  // 你不能直接改变 store 中的状态。改变 store 中的状态的唯一途径就是显式地提交 (commit) mutation
  mutations: {
    // todoone 
    // Object.keys()
    // mutationsType:function(){

    // },
    [COUNTADD](state){
      state.count+=1;
    },
    countDesc(state){
      state.count-=1;
    },
    changeCount(state,payload){  // payload 参数载荷 
      state.count+=payload;
    },
    changeCityOnce(state,payload){
      state.city = payload;
    },
    changeWord(state,payload){
      state.word = payload;
    },
    changeMsg(state,payload){
      state.msg = payload;
    },
    changeDataFlag(state,payload){
      // state.data.flag = !state.data.flag  对象 深浅拷贝  
      state.data = {
        ...state.data,
        flag:payload
      }
    },
    changeDataTest(state,payload){
      state.data = {
        ...state.data,
        test:payload 
      }
    },
    changeNum(state,payload){
      state.num+=payload 
    },
    increment(state){
      state.num++;
    },
    getNewWord(state,payload){
      state.word = payload;
    },
    getNewList(state,payload){
      state.list = payload;
    }
  },
  // Action 可以包含任意异步操作
  // Action 必须提交一个mutation 
  // 同步的操作可以省略Action 直接进入mutation 
  actions: {
    increment(context){
      context.commit('increment')
    },
    getNewWord({commit},payload){  // context = context.commit = {commit:function(){}} = {commit} 
      commit("getNewWord",payload)
    },
    
    getNewTestAsync({commit}){
      axios.get("http://localhost:2114/test")
      .then(res=>{
        console.log(res)
        commit('changeDataTest',res.data[0])
      })
    },
    // async+await  成双入队  
    // await 把异步改写成同步  必须等待当前的异步操作执行完毕才能执行下一步操作 
    async getNewList({commit}){
      let res = await axios.get("http://localhost:2114/list")
      commit('getNewList',res.data)
    }
  },
  // modules: {

  // },
  // store 的计算属性
  getters:{
    newCount(state){
      return state.count * 10 + 888
    }
  }
})
export default  store;